<template>
  <div class="home">
    <mbx name1="商品管理" name2="参数列表" />
    <!-- card -->
    <el-card class="mt16">
      <el-alert
        title="注意：只允许为第三级分类设置相关参数！"
        type="warning"
        show-icon
        effect="dark"
      >
      </el-alert>
      <!-- 选择商品分类 -->
      <el-row class="mt16">
        <el-col :span="3">选择商品分类：</el-col>
        <el-col :span="8"
          ><el-cascader
            v-model="value"
            :options="options"
            :props="{ expandTrigger: 'hover' }"
          ></el-cascader
        ></el-col>
      </el-row>
      <!-- 卡片式 -->
      <el-tabs
        v-model="activeName"
        type="card"
        @tab-click="handleClick"
        class="mt16"
      >
        <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
        <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeName: 1
    }
  },
  mounted() {},
  methods: {}
}
</script>

<style lang="scss" scoped>
.home {
  width: 100%;
  .h {
    width: 100%;
    display: flex;
  }
}
</style>
